<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<script type="text/javascript">
    $(document).ready(function() {
        var fm = ["childForm", "child_container", "childFormId"];
        Page.createForm(fm);
        TempUtil.render('child_template', 'childForm', DOC);

        Page.postJSON({
            json: {
                cmd: RequestCmd.GET_DMZ
            },
            success: function(data) {
              if(data.enable == "1"){
                $("input[value='1']").attr("checked",true);
                $("#trIp").show();
              }else{
                 $("#trIp").hide();
                $("input[value='0']").attr("checked",true);
              }

              $("#dmzIp").val(data.ip);
            }

        });

        $("input[name='dmzSwich']").change(function(){
            if( $("input[value='1']").is(":checked")){
                 $("#trIp").show();
             }else{
                $("#trIp").hide();
             }
        })


    $("#btnSave").on("click",function(){

            

            var json = new Object();

            json.enable =$("input[name='dmzSwich']:checked").val();
            if(json.enable == "1"){
                if($("#dmzIp").val() == ""){
                     AlertUtil.alertMsg(CHECK.required.ip);
                     return false;
                }
                if(!CheckUtil.checkIp($("#dmzIp").val())){
                   AlertUtil.alertMsg(CHECK.format.ip);
                   return false;
                }
            }
            json.ip = $("#dmzIp").val();
            json.cmd = RequestCmd.SET_DMZ;
            json.method = JSONMethod.POST;
            Page.postJSON({
               json: json,
               success: function(data) {
                   AlertUtil.alertMsg(PROMPT.saving.success);
               }
           });
    })

    });
</script>

<div class="tab_box" id="child_container">
    <div id="childFormId">
        <script type="text/template" id="child_template">
            <!-- <form id="childForm"> -->
                <table id="childTable" class="detail" cellspacing="0">
                    <tr id="trDialMode">
                        <th><%- CHECK.required.dmzSwitch %></th>
                        <td>
                            <input type="radio" name="dmzSwich" value="1"><%- DOC.status.enabled %>
                            <input type="radio" name="dmzSwich" value="0"><%- DOC.status.disabled %>
                        </td>
                    </tr>
                    <tr id="trIp" style="display:none;">
                        <th><%-  DOC.net.ip %></th>
                        <td>
                            <input type="text" name="dmzIp" id="dmzIp">
                        </td>
                    </tr>
    
                        
                    <tr id="trSave">
                        <th>&nbsp;</th>
                        <td>
                            <input type="button" id="btnSave" value="<%- btn.save %>"/>
                        </td>
                    </tr>
                </table>
            <!-- </form> -->
        </script>
    </div>  
</div>
